import DashBoard from "./DashBoard/dash-board";
import ResourceDetails from "./DashBoard/items/resource-details";
import ResourceOverview from "./DashBoard/items/resource-overview";
import ResourceOverviewTable from "./DashBoard/items/resource-overview-table";
import RunTimePanel from "./DashBoard/items/run-time-panel";
import TablePanel from "./DashBoard/items/table-panel";
import "./css/scrollbar-view.scss";
import Submenu from "./submenu";

export default defineComponent({
	name: "ScrollbarView",
	setup() {
		return () => (
			<div
				class="scrollbar-view flex flex-grow flex-col"
				style="position: relative;overflow: scroll;margin-right: -8px;margin-bottom: -8px;min-height: calc(100% + 8px);max-height: calc(100% + 8px);"
			>
				<div class="p-[16px] pt-0 flex-basis-full flex-grow">
					<Submenu></Submenu>
					<DashBoard>
						<ResourceOverview></ResourceOverview>
						<ResourceOverviewTable></ResourceOverviewTable>
						<ResourceDetails></ResourceDetails>
						<RunTimePanel></RunTimePanel>
						<TablePanel></TablePanel>
					</DashBoard>
				</div>
			</div>
		);
	}
});
